@extends('home.common.common')

@section('title',$articleInfo['title'])

@section('content')

<div class="layui-container">
    <div class="layui-row layui-col-space15">

        <div class="layui-col-md8 content detail">
            
            <div class="fly-panel detail-box">
                <h1>{{$articleInfo['title']}}</h1>
                <div class="fly-detail-info">
                    <!-- <span class="layui-badge">审核中</span> -->
                    <!-- <span class="layui-badge layui-bg-green fly-detail-column">动态</span> -->

                    <!-- <span class="layui-badge" style="background-color: #999;">未结</span> -->
                    <!-- <span class="layui-badge" style="background-color: #5FB878;">已结</span> -->
                    <!-- 
                    <span class="layui-badge layui-bg-black">置顶</span>
                    <span class="layui-badge layui-bg-red">精帖</span>
                    -->

               <!--      <span class="fly-list-nums"> 
                        <a href="#comment"><i class="iconfont" title="回答">&#xe60c;</i> 66</a>
                        <i class="iconfont" title="人气">&#xe60b;</i> {{$articleInfo['click']}}
                    </span> -->
                </div>
                <hr>
                <div class="detail-body photos">
                    <div id="content">
                        <textarea   style="display:none;">{!!$articleInfo['content']!!}</textarea>
                    </div>
                </div>
            </div>

            <div class="fly-panel detail-box"  id="replies">
                <fieldset class="layui-elem-field layui-field-title" style="text-align: center;">
                    <legend>回帖</legend>
                </fieldset>

                <ul >
                    @foreach($repliesList as $k=>$v)
                    <li  >
                        <div class="detail-about detail-about-reply">
                            <a class="fly-avatar" href="">
                                <img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg" alt=" ">
                            </a>
                            <div class="fly-detail-user">
                                <a href="" class="fly-link">
                                    <cite>{{$v['nickname']}}</cite>
                                </a>
                            </div>

                            <div class="detail-hits">
                                <span>2017-11-30</span>
                            </div>
                            <!-- <i class="iconfont icon-caina" title="最佳答案"></i> -->
                        </div>

                        <div class="detail-body jieda-body photos">
                            <p>
                                {{$v['content']}}
                            </p>
                        </div>
                    </li>
                    <hr>
                    @endforeach
                    {{ $repliesList->render() }}

                    <!-- 无数据时 -->
                    <!-- <li class="fly-none">消灭零回复</li> -->
                </ul>
            
                <div class="layui-form layui-form-pane">
                    <div class="layui-row layui-col-space15 layui-form-item" >
                    <form  method="post">

                        <div class="layui-col-md9" style="padding: 20px 0;">
                            <label for="L_title" class="layui-form-label">昵称*</label>
                            <div class="layui-input-block">
                                <input type="text"  name="nickname" value=""  lay-verify="required" autocomplete="off" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-col-md9" style="padding: 20px 0;">
                            <label for="L_title" class="layui-form-label">邮箱地址*</label>
                            <div class="layui-input-block">
                                <input type="text"  name="email" value="" lay-verify="email" autocomplete="off" class="layui-input">
                            </div>
                        </div>

                        <div class="layui-form-item layui-form-text">
                            <label for="L_title" class="layui-form-label">回复内容*</label>
                            <div class="layui-input-block">
                                <textarea name="content" lay-verify="required" placeholder="请输入内容"  class="layui-textarea fly-editor" style="height: 150px;"></textarea>
                            </div>
                        </div>

                        <div class="layui-col-md9" style="padding-bottom: 20px ;">
                            <label for="L_title" class="layui-form-label">验证码*</label>
                            <div class="layui-input-block">
                               
                                    <input type="text"  name="captcha" value="" style="width: 120px;display: -webkit-inline-box;" lay-verify="required" autocomplete="off" class="layui-input">
                                    <img src="{{ captcha_src() }}"  onclick="this.src='/captcha/default?'+Math.random()">
                            </div>
                        </div>

                        <input type="hidden" name="article_id" lay-verify="required" value="{{$articleInfo['id']}}">
                        {{csrf_field()}}
                        <div class="layui-form-item">
                            <button class="layui-btn" lay-filter="replies_form" lay-submit>提交回复</button>
                        </div>
                    </form>
                    </div>
                </div>
            </div>

        </div>

    </div>
</div>
@include('markdown::decode',['editors'=>['content']])
@endsection
@section('js')

<script type="text/javascript">
    var anchors = '{{$anchors}}';
    if(anchors){
        window.location.href = window.location.href + '#replies';
    }

    layui.use('form', function(){
        var form = layui.form;
        form.on('submit(replies_form)', function(data){
            $.ajax({
                type:'post',
                url:"{{url('home/replies/add')}}",
                data:data.field,
                success:function(res){
                    if(res.status=='success'){
                        layer.msg(res.msg, {icon: 1},function(){
                            var url = window.location.href;
                            var name = url.substr(url.length-8);
                            if(name == '#replies'){
                                url = url.substr(0,url.length-8);
                            }
                            location.reload(true);
                            window.location.href = url + '#replies';
                        });
                    }else{
                        layer.msg(res.msg, {icon: 2});
                    }
                }
            });
            return false;
        });
        //各种基于事件的操作，下面会有进一步介绍
    });
  
</script>
@endsection
